import Render from "../Render"
export default class UIRender extends Render{
 
    constructor(prop){
        super(prop)
        this.name = "ui-select"
        this.order=100
    }
    render(){
        // console.log(this)
        let draw = this.canvas.draw;
        let parentNode = this.canvas.canvas.parentNode
        let context = draw.context
        if(parentNode){ 
            this.canvas.canvas.width=parentNode.clientWidth;
            this.canvas.canvas.height=parentNode.clientHeight;
        }

         let canvas = this.DataManager.canvasLayers.find(canvas=>canvas.name==='background')
         
         if(canvas&&this.DataManager.UIslectNode.selected.uid){
       
            context.save();
            draw.clear();
            context.translate( this.DataManager.worldTransForm.x,this.DataManager.worldTransForm.y)
            let node = this.DataManager.UIslectNode.selected;

       
            

             let data = canvas.draw.getImageData({
                x:node.transform.x*this.DataManager.worldScale.scale+this.DataManager.worldTransForm.x ,
                y:node.transform.y*this.DataManager.worldScale.scale+this.DataManager.worldTransForm.y,
                w:node.transform.w*node.scale.x *this.DataManager.worldScale.scale,
                h:node.transform.h*node.scale.x *this.DataManager.worldScale.scale
            })
            
            for(var i=0;i<data.data.length;i+=4){
                if(data.data[i]===0&&data.data[i+1]===0&&data.data[i+2]===0&&data.data[i+3]===0){
                    continue
                }else{
                    data.data[i]=0;
                    data.data[i+1]=0;
                    data.data[i+2]=0;
                    // data.data[i+3]=255;
                }
                
            }

            


        



            draw.putImageData(data,0,0)
            context.restore();
         }

        //  canvas.draw.getImageData()
        
    }
}